<template>
    <SlotsAddProjectOpt
        :loading="loading"
        :loadingText="loadingText"
    >
        <div>
            <div class="upload_tip">提示: 请上传转让方（银行或AMC等）的不良债权项目信息，xlsx或txt文件格式，目前仅支持每次上传单个项目（可含多户债权）</div>
            <div class="upload_opt_area">
                <!-- 上传文件 -->
                <FileUpload
                    ref="uploadRef"
                    :drag="data.upload.drag"
                    :tip = "data.upload.tip"
                    :acceptedExtensions = "data.upload.acceptedExtensions"
                />
                <div class="d-flex justify-content-end">
                    <el-button class="ml-3" type="success" @click="submitUpload">
                        Prompt模板配置
                    </el-button>
                    <el-button class="ml-3" type="success" @click="submitUpload">
                        上传项目信息
                    </el-button>
                </div>
            </div>
        </div>
    </SlotsAddProjectOpt>
</template>

<script setup lang="ts">
    import { ref, reactive } from 'vue'
    import { ElMessage} from 'element-plus'
    import { useRouter } from "vue-router";
    import SlotsAddProjectOpt from '/src/components/SlotsAddProjectOpt.vue'
    import FileUpload from '@/components/FileUpload.vue'

    const router = useRouter();
    const loadingText = ref('Lodding...')
    const loading = ref(false)
    // 当前组件获取上传文件字组件参数
    const uploadRef = ref()

    const data = reactive({
        upload: {
            drag: true,
            acceptedExtensions: ['xlsx', 'txt'],
            tip: '限制单个文件，新文件会覆盖旧文件，且仅支持xlsx和txt文件上传'
        }
    })
    // 开始要素识别
    const submitUpload = () => {
        // 从上传文件子组件中获取要上传的文件集合
        let uploadFile = uploadRef.value.fileList
        if (uploadFile.length === 0) {
            return ElMessage.error('请选择要上传的文件');
        }
        const formData = new FormData();
 
        uploadFile.forEach((file) => {
            formData.append('file', file.raw);
            
        });
        loadingText.value = '正在进行项目转换，请稍等...'
        // 开启loading
        loading.value = true;
        setTimeout(() => {
            ElMessage.success('项目转换成功')
            router.push('/bi_frontend/assetTagging/aiPrompt' )
        }, 3000);
    }
</script>

<style scoped>
.upload_tip {
    background-color: #ecf5ff;
    padding: 11px;
    border-radius: 7px;
}
.upload_opt_area {
    padding-top: 80px;
}
.upload_input {
}
</style>